<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Show Info</title>
        <style>
            .alignTop {
                vertical-align: top;
            }
            
            h1{
                font-weight: bold;
                text-align: center;
            }
            .ui-layout-unit-center .ui-layout-bd {
                border: 0;
            }
            
            .ui-layout-unit-left .ui-layout-bd {
                border: 0;
            }
            
        </style>
    </h:head>
    <h:body>        
            <p:layout fullPage="true">
                <p:layoutUnit position="top" height="80" resizable="false" closable="false" collapsible="false">
                    
                </p:layoutUnit>
                <p:layoutUnit position="left" width="300" resizable="false" closable="false" collapsible="false">
                    <h:form>
                        <h:panelGrid id="searchEventCriteria" style="background: goldenrod">
                            <h3><font color = "Apricot">Search Event</font></h3>
                            <hr/>
                            Name:
                            <p:inputText value="#{userPerformanceMB.searchEventName}"/>
                            Venue:
                            <h:selectOneMenu style="width: 260px" value="#{userPerformanceMB.searchVenueName}">
                                <f:selectItem itemLabel="Select One..." itemValue= ""/>
                                <f:selectItems value="#{userPerformanceMB.getAllActiveVenues()}"></f:selectItems>
                            </h:selectOneMenu>
                            Genre:
                            <h:selectOneMenu style="width: 260px" value="#{userPerformanceMB.searchGenre}">
                                <f:selectItem itemLabel="Select One..." itemValue= ""/>
                                <f:selectItem itemLabel="Concert" itemValue="Concert"/>
                                <f:selectItem itemLabel="Dance" itemValue="Dance"/>
                                <f:selectItem itemLabel="Musical" itemValue="Musical"/>
                                <f:selectItem itemLabel="Theatre" itemValue="Theatre"/>
                                <f:selectItem itemLabel="Others" itemValue="Others"/>
                            </h:selectOneMenu>
                            Type:
                            <h:selectOneMenu style="width: 260px" value="#{userPerformanceMB.searchType}">
                                <f:selectItem itemLabel="Select One..." itemValue= ""/>
                                <f:selectItem itemLabel="Comedy" itemValue="Comedy"/>
                                <f:selectItem itemLabel="Horror" itemValue="Horror"/>
                                <f:selectItem itemLabel="Thriller" itemValue="Thriller"/>
                                <f:selectItem itemLabel="Family" itemValue="Family"/>
                                <f:selectItem itemLabel="Drama" itemValue="Drama"/>
                                <f:selectItem itemLabel="Rock" itemValue="Rock"/>
                                <f:selectItem itemLabel="Pop" itemValue="Pop"/>
                                <f:selectItem itemLabel="Rhythms and Blues" itemValue="Rhythms and Blues"/>
                                <f:selectItem itemLabel="Others" itemValue="Others"/>
                            </h:selectOneMenu>
                            Date:  
                            <p:calendar value="#{userPerformanceMB.findDate}" mindate="#{userPerformanceMB.findingMinDate()}" maxdate="#{userPerformanceMB.findingMaxDate()}" pattern="dd/MM/yyyy"/>
                            <hr/>
                            <p:commandButton value="Search" action="searchevents.xhtml?faces-redirect=true" />
                        </h:panelGrid>
                    </h:form>
                </p:layoutUnit>
                <p:layoutUnit position="center" scrollable="true">
                    <p:panel id="pnl" header="Event Information for Event #{userPerformanceMB.infoEvent}" style="background: gold">
                        <h:inputHidden value="#{userPerformanceMB.infoId}" />
                        <h:panelGrid columns="8" columnClasses="alignTop, alignTop">
                            <h:form>  
                                <h:column>
                                    <p:graphicImage  value="#{userPerformanceMB.infoPoster}" width="300" height="400"/>
                                    <br/>
                                    <h:commandLink action="buyeventshow.xhtml?faces-redirect=true">
                                        <p:graphicImage  value="picture/Booking.gif" width="150" height="75"/>
                                        <f:setPropertyActionListener target="#{userPerformanceMB.selectedEvent}" value="#{userPerformanceMB.infoEvent}"/>
                                        <f:setPropertyActionListener target="#{userPerformanceMB.selectedEventId}" value="#{userPerformanceMB.infoId}"/>
                                    </h:commandLink>
                                    <h:commandLink immediate="true" action="mainpage.xhtml?faces-redirect=true">
                                        <p:graphicImage  value="picture/Back.gif" width="150" height="75"/>
                                    </h:commandLink>
                                </h:column>
                            </h:form>
                            <h:column>
                                <h4>Details</h4>
                                <h:outputText value="Type: #{userPerformanceMB.infoType}"/>
                                <br/>
                                <h:outputText value="Genre: #{userPerformanceMB.infoGenre}"/>
                                <br/>
                                <h:outputText value="Rating #{userPerformanceMB.infoRating}"/>
                                <br/>
                                <h:outputText value="Language: #{userPerformanceMB.infoLanguage}"/>
                                <br/>
                                <h:outputText value="Duration: #{userPerformanceMB.infoDuration} Minutes" />
                                <hr/>
                                <h4>Description</h4>
                                <h:outputText value="#{userPerformanceMB.infoDescription}"/>
                                <hr/>
                            </h:column>
                        </h:panelGrid>
                    </p:panel>
                </p:layoutUnit>
            </p:layout>        
    </h:body>
</html>
